<template>
<div class="layout-app">
	<!-- main -->
		<!-- 新增 -->
	<div class="addAcc">
		<el-dialog title="查看" v-dialogDrag :visible.sync="dialogFormVisible" width="70%" :before-close="handleAddClose">
			<el-divider></el-divider>
			<!-- tabs -->
			<div class="tabs">
				<div class="tabsMain">
					<!-- tabs-left -->
					
				</div>
			</div>
		  <div slot="footer" class="dialog-footer">
			<el-button size="mini" type="primary" @click="addNewDiction">添加</el-button>
			<el-button size="mini" @click="dialogFormVisible = false">取消</el-button>
		  </div>
		</el-dialog>
	</div>
</div>
</template>

<script>
// self
// import AccType from './AccType.js'
// import country from './country.js'
// import nationality from './nationality.js'
// prop
// import addAccTable from './addAccTable.vue'
// import addAccStations from './addAccStations.vue'
// import addAccIntruce from './addAccIntruce.vue'
// ext
import { getLunar } from 'chinese-lunar-calendar'

// 接口
// import { getArea,getArea2,getArea3,addStaff } from "@/api/user.js";
export default {
	components:{
		
	},
	data(){
		return{
			//str
			value:'',
			deptCode:'',
			getLunarDay: '',
			areaCode:'',
			areaPName:'',
			idx:'',
			year: new Date().getFullYear(),
			month: new Date().getMonth() + 1,
			date: new Date().getDate(),
			lunarDate: '',//农历
			// 1 - 3
			firstName:'',
			seconedName:'',
			thirdName:'',
			//num
			
			//ble
			selectDisabled:true,
			dialogFormVisible:false,
			//arr
			formType:[],
			idType:[
				{id:1,label:'居民身份证',value:'居民身份证'},{id:2,label:'中国人民解放军军人身份证件',value:'中国人民解放军军人身份证件'},
				{id:3,label:'中国人民武装警察身份',value:'中国人民武装警察身份'},{id:4,label:'‌港澳居民来往内地通行证‌',value:'港澳居民来往内地通行证‌‌港澳居民居住证‌'},
				{id:5,label:'台湾居民来往大陆通行证',value:'台湾居民来往大陆通行证'},{id:6,label:'护照',value:'护照'},
				{id:7,label:'外国人永久居住证‌',value:'外国人永久居住证‌‌'},{id:8,label:'其他',value:'其他'},
			],//证件类型
			sexOptions:[{id:1,label:'男',value:'男'},{id:2,label:'女',value:'女'}],
			marryiedOptions:[{id:1,label:'未婚',value:'未婚'},{id:2,label:'已婚',value:'已婚'},{id:3,label:'离异',value:'离异'},{id:4,label:'丧偶',value:'丧偶'},{id:5,label:'再婚',value:'再婚'}],
			statusOptions:[{id:1,label:'是',value:'是'},{id:2,label:'否',value:'否'}],
			bloodOptions:[{id:1,label:'A型血',value:'A型血'},{id:2,label:'B型血',value:'B型血'},{id:3,label:'O型血',value:'O型血'},{id:4,label:'AB型血',value:'AB型血'},{id:5,label:'RH（熊猫）型血',value:'RH（熊猫）型血'}],
			PoliticalOptions:[
				{id:1,label:'群众',value:'群众'},{id:2,label:'无党派人士',value:'无党派人士'},{id:3,label:'台湾民主自治同盟盟员',value:'台湾民主自治同盟盟员'},{id:4,label:'九三学社社员',value:'九三学社社员'},
				{id:5,label:'中国致公党党员',value:'中国致公党党员'},{id:6,label:'中国农工民主党党员',value:'中国农工民主党党员'},{id:7,label:'中国民主促进会会员',value:'中国民主促进会会员'},
				{id:8,label:'中国共产主义青年团团员',value:'中国共产主义青年团团员'},{id:9,label:'中国共产党预备党员',value:'中国共产党预备党员'},{id:9,label:'中国共产党党员',value:'中国共产党党员'},
			],
			//obj
			provinceMap:{}, //存储三级联动城市籍贯
			pickerOptions: {
			  shortcuts: [{
				text: '今天',
				onClick(picker) {
				  picker.$emit('pick', new Date());
				}
			  }, {
				text: '昨天',
				onClick(picker) {
				  const date = new Date();
				  date.setTime(date.getTime() - 3600 * 1000 * 24);
				  picker.$emit('pick', date);
				}
			  }, {
				text: '一周前',
				onClick(picker) {
				  const date = new Date();
				  date.setTime(date.getTime() - 3600 * 1000 * 24 * 7);
				  picker.$emit('pick', date);
				}
			  }]
			},
			addForm:{
				userCode: "", //编码
				// fullNane: "001",//姓名
				idType:"",//身份证类型
				idNumber: "", //身份证号码
				sex: "",//性别
				dateOfEmp: "",//工作日期
				birthDate: "",//出生日期
				lunarBirthDate: "", //农历出生日期
				minZu:"", //民族
				nationality:"",//国籍
				nativePlace:"",//籍贯
				maritalStatus:"", //婚姻状况 1:未婚 2:已婚 3:离异
				politicalStatus:"",//政治面貌
				bloodType:"",//血型
				contactNumber:'',//联系电话
				contactAddress:'',//联系地址
				entryTime:'2025-01-18',//入职时间
				institutionId:"",//隶属机构
				contactAddress:'',//联系地址
				nativePlace:'',//户籍地址 = 籍贯
				standardCode:'',//贯标编码
				standardName:'',//贯标名称	
				//2
				deptList:[],
				// educationalBackground:'',//学历
				// major:'',//所学专业
				// professionalTitle:'',//专业职称
				// qualificationNumber:'',//资格证号
				// practiceDate:'',//职业日期
				// prescriptionRights:'',//处方权
				// anesthesiaAuthorization:'',//麻药权限
				// surgicalPermission:'',//手术权限
				// spiritPermission:'',//精神权限
				// poisonPermission:'',//毒药权限
				// antiTumorPermission:'',//抗肿瘤药物权限
				//3
				signatureImage:'',//手工签名照片
				workIdPhoto:'',//工作证件照
				pcElectronicImage:'',//执业证电子图片
				qcElectronicImage:''//资格证电子图片
			},
			options:[],
			countryOptions:[],
			MZOptions:[],
		}
	},
	mounted() {
		
	},
	methods:{
		// 时间处理
		changDate(val){
			let i = this.idx
			switch(i) {
				case 5:
				function formatDate(date) {
				  const year = date.getFullYear();
				  const month = (date.getMonth() + 1).toString().padStart(2, '0');
				  const day = date.getDate().toString().padStart(2, '0');
				  return `${year}-${month}-${day}`;
				}
				 
				// 使用示例
				const now = new Date();
				this.addForm.dateOfEmp = formatDate(val);
			}
		},
		handleSelectCost(val) {
		  this.addForm.nativePlace = val.join(',')
		},
		// testA(val){
		// 	console.log(val);
		// },
		// 键盘事件
		 handleKeyup(event) {
		  // 检查按键
		  if (event.key === 'Enter') {
			// 执行相应的动作
		  }
		},
		inputChance(v,i){
			console.log(v,i);
			// i event
			switch (i) {
				case 3:
					// 同步赋值
					let birthday = "";
					let time = '';
					let sex = '';
					let age = '';
					let myDate = new Date()
					//根据身份证号码获取出生年月
					if (this.addForm.idNumber.length == 18) {
						this.areaCode = this.addForm.idNumber.substr(0, 6);
						this.year = this.addForm.idNumber.substr(6, 4);
						this.month = this.addForm.idNumber.substr(10, 2);
						this.date = this.addForm.idNumber.substr(12, 2);
						// console.log(this.year + '年',this.month+ 'yue',this.date+'日');
					    birthday = this.addForm.idNumber.substr(6, 8);
					    time = birthday.replace(/(.{4})(.{2})/, "$1-$2-");
						this.addForm.birthDate = time
						// let dates = dayjs().format("YYYY/MM/DD");
						// 获取农历
						// console.log(time)
						this.getLunarDay = getLunar(this.year, this.month, this.date)
						this.addForm.lunarBirthDate = this.getLunarDay.dateStr
						// 农历	酆语梦 35021119780422570X 测试 
					}
					//根据身份证号码获取性别
					if (this.addForm.idNumber.length == 18) {
					  sex = this.addForm.idNumber.substr(16,1);
					  if(sex% 2 == 1){
					  this.addForm.sex = '男'
					   } else {
					  this.addForm.sex = '女'
					  }
					}
					break;
			}
		},
		//  select聚焦
		sname(v,i) {
			// v.id = i;
			this.idx = i;
			// i event
			switch (i) {
				case 2:
					// 有效状态
					
					break;
			}
		},
		// SelectVal to editForm
		scname(v){
			v.id = this.idx;
			// i event
			switch (this.idx) {
				case 2:
				// 字段映射
					this.addForm.idType = v.value;//类型
					break;
				case 4:
					// 高级事件
					this.addForm.sex = v.value;
					break;
				case 8:
					// 国籍  确定Value键值对
					this.addForm.nationality = v.value;
					if(this.addForm.nationality == '中国'){
						this.selectDisabled = false;
					}else{
						this.selectDisabled = true;
					}
					break;
				case 9:
					// 民族  确定Value键值对
					this.addForm.minZu = v.value;
					break;
				case 10:
					// 最小单位  确定Value键值对
					this.addForm.nativePlace = v.value;
					console.log(v)
					break;
				case 11:
					this.addForm.maritalStatus = v.value;
					break;
				case 12:
					this.addForm.politicalStatus = v.value;
					break;
				case 13:
					// 基药类型  确定Value键值对
					this.addForm.bloodType = v.value;
					
					break;
			}
		},
		// 打开model
		openModel(){
			this.dialogFormVisible = true;
		},
		//新增保存
		async addNewDiction(){
			this.$refs.parMehod.tof();
			this.addForm.userCode = JSON.parse(sessionStorage.getItem('deptCode'))
			// console.log(this.form);
			let rs = await addStaff(this.addForm);
			let { code,message } = rs;
			if (code === 200) {
				this.$message({
					type: 'success',
					message: '员工档案新增成功！',
				});
				location.reload();
				this.dialogFormVisible = false;
			} else {
				this.$message.error('失败！')
			}
		},
		// 控制科室属性新增model，接收子组件传递过来的值并赋值
		sonData(newVal){
			// console.log(newVal);
			console.log(newVal,'孙子组件传过来的');
			// this.tableData.push(JSON.parse(JSON.stringify(newVal)))
			this.addForm.deptList.push(JSON.parse(JSON.stringify(newVal)))
		},
		//sons
		//接收父组件传过来的
		getValue(data) {
			console.log(data,'子组件3传过来的');
			if(data != ''){
				this.addForm.signatureImage = data.signatureImage
				this.addForm.workIdPhoto = data.workIdPhoto
				this.addForm.pcElectronicImage = data.pcElectronicImage
				this.addForm.qcElectronicImage = data.qcElectronicImage
			}
		},
		getValue2(data) {
			console.log(data,'子组件3.2传过来的');
			if(data != ''){
				this.addForm.workIdPhoto = data
			}
		},
		//接收父组件传过来的
		sonValue(data) {
			// console.log(data,'子2组件传过来的');
			if(data != ''){
				this.addForm = {...this.addForm, ...data};
				// this.addForm.push(...data)
			}
		  // this.addForm.push(JSON.parse(JSON.stringify(data)))
		},
		
		// 关闭
		handleAddClose(done) {
			this.$confirm('确认关闭？')
			  .then(_ => {
				location.reload();
				done();
				// this.formdisabled = true;
			  })
			  .catch(_ => {
				this.formdisabled = this.formdisabled;
			  });
		},
	},
	
}
</script>

<style lang="less" scoped>
.layout-app{
    width: 100%;
    height: 100%;
    display: flex;
	background-color: f8f8f8;
    .addAcc{
		/deep/ .el-dialog__header{
			padding: 12px;
			background-color: #007bb0;
		}

		/deep/ .el-form-item--mini.el-form-item, .el-form-item--small.el-form-item{
			margin-bottom: 8px;
		}
		/deep/ .el-dialog__title{
			color: #fff;
		}
		/deep/ .el-dialog__headerbtn .el-dialog__close{
			color: #fff;
		}
		/deep/ .el-dialog__headerbtn .el-dialog__close:hover{
			background-color: brown;
		}
		/deep/ .el-dialog__body{
			padding: 0;
		}
		/deep/ .el-divider--horizontal{
			margin: 0;
		}
		/deep/ .el-form-item__label{
			display: flex;
			justify-content: right;
			font-size: 12px;
		}
		// self
		// 选项卡
		.tabs{
			
			.tabsMain{
				display: flex;
				border: 1px solid #f4f4f4;
				.tabs-left{
					flex: 1;
					padding:12px 0 0 12px;
					border: 1px solid #e8f0ee;
					// date flex
					.autoWidth{
						width: 100%; /* 设置宽度为100% */
					}
					/deep/ .el-input__icon{
						color: brown;
					}
				}
				.tabs-right{
					flex: 1;
					padding:12px;
					margin-left: 8px;
					border: 1px solid #e8f0ee;
				}
			}
			
			
		}
	}
}
</style>